<section class="fd-section">
  <div class="fd-section__header">
    <h3 class="fd-section__title">LuigiClient linkManager methods</h3>
  </div>
  <div class="fd-layout-panel">
    <div class="fd-layout-panel__header">
      <div class="fd-layout-panel__head">
        <h3 class="fd-layout-panel__title">Navigate</h3>
      </div>
    </div>
    <div class="fd-layout-panel__body">
      <ul class="fd-list">
        <li class="fd-list__item">
          <a
            href="javascript:void(0)"
            class="fd-link"
            (click)="linkManager().goBack(true)"
          >
            go back: single iframe, standard history back</a
          >
          <app-code-snippet data="linkManager().goBack()"> </app-code-snippet>
        </li>
        <li class="fd-list__item">
          <a
            href="javascript:void(0)"
            class="fd-link"
            (click)="linkManager().navigate('/overview')"
            >absolute: to overview</a
          >
          <app-code-snippet data="linkManager().navigate('/overview')"></app-code-snippet>
        </li>
        <li class="fd-list__item">
          <a
            href="javascript:void(0)"
            class="fd-link"
            (click)="uxManager().addBackdrop()"
          >
            add backdrop</a
          >
          <app-code-snippet data="uxManager().addBackdrop()"> </app-code-snippet>
        </li>
        <li class="fd-list__item">
          <a
            href="javascript:void(0)"
            class="fd-link"
            (click)="uxManager().removeBackdrop()"
          >
            remove backdrop</a
          >
          <app-code-snippet data="uxManager().removeBackdrop()"> </app-code-snippet>
        </li>
        <li class="fd-list__item">
          <a
            href="javascript:void(0)"
            class="fd-link"
            (click)="linkManager().withParams({test: 'true'}).openAsModal('/settings', {title:'PreservedView', size:'m'})"
          >
            open modal</a
          >
          <app-code-snippet
            data="linkManager().withParams({test: true}).openAsModal('/settings', {title:'PreservedView', size:'m'})"
          >
          </app-code-snippet>
        </li>
        <li class="fd-list__item">
          <a href="javascript:void(0)" class="fd-link" (click)="openConfirmationModal()">
            open confirmation modal</a
          >
          <app-code-snippet
            data="uxManager().showConfirmationModal({ body: 'Just a confirmation modal' }).then(() => { console.log('opended a confirmation modal'); })"
          >
          </app-code-snippet>
        </li>
        <li class="fd-list__item">
          <a
            href="javascript:void(0)"
            class="fd-link"
            (click)="linkManager().openAsModal('/projects/pr1/miscellaneous2', {title:'miscellaneous2', size:'m'})"
          >
            open misc2 in modal</a
          >
          <app-code-snippet
            data="linkManager().openAsModal('/projects/pr1/miscellaneous2', {title:'miscellaneous2', size:'m'})"
          >
          </app-code-snippet>
        </li>
      </ul>
    </div>
  </div>
</section>
